<!DOCTYPE html>
<html lang="zh-CN">
<head>
<meta charset="utf-8">
<title>商家登录</title>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta name="author" content="Zhou Feng <a4435351@126.com>">
<meta name="renderer" content="webkit">
<meta http-equiv="X-UA-Compatible" content="IE=Edge,chrome=1">
<style>
body {
	font-family: 'microsoft yahei';
	font-size: 16px;
	min-width: 1024px;
}

.logo {
	height: 100px;
}

.menu li {
	width: 150px;
	text-align: center;
	padding: 0;
	'
}

.help-block {
	color: #f00;
	display: none;
}

.rooms {
	background-color: #F4F4F4;
}
</style>
<style type="text/css">
* {
	margin: 0;
	padding: 0;
}

.container {
	background: #fff;
}

.loginBox {
	width: 420px;
	height: 270px;
	padding: 0 20px;
	border: 1px solid #fff;
	color: #000;
	margin-top: 40px;
	border-radius: 8px;
	background: white;
	box-shadow: 0 0 15px #222;
	background: -moz-linear-gradient(top, #fff, #efefef 8%);
	background: -webkit-gradient(linear, 0 0, 0 100%, from(#f6f6f6),
		to(#f4f4f4));
	font: 11px/1.5em 'Microsoft YaHei';
	position: absolute;
	left: 50%;
	top: 50%;
	margin-left: -210px;
	margin-top: -115px;
}

.loginBox h2 {
	height: 45px;
	font-size: 20px;
	font-weight: normal;
}

.loginBox .left {
	border-right: 1px solid #ccc;
	height: 100%;
	padding-right: 20px;
}

.span7 {
	float: left;
	width: 60%;
}

.span5 {
	float: left;
	width: 30%;
	margin-left: 20px;
}
.requied{
	color: red;
}
.container{
width: 1024px;
}
</style>
</head>
<!-- HTML5 shim, for IE6-8 support of HTML5 elements -->
<!--[if lt IE 9]>
      <script src="http://html5shim.googlecode.com/svn/trunk/html5.js"></script>
    <![endif]-->
<!-- <link class="bootstrap library" rel="stylesheet" type="text/css" href="${base}/plugins/bootstrap/css/bootstrap.min.css"> -->
<link type="text/css" rel="stylesheet" href="${base}/plugins/formValidator4.0.1/style/validatorTidyMode.css" />
<link id="bootstrapCss" rel="stylesheet" href="${base}/plugins/zui/css/zui.css" />
<script class="bootstrap library" src="${base}/plugins/jquery.js" type="text/javascript"></script>
<script class="bootstrap library" src="${base}/plugins/bootstrap/js/bootstrap.min.js" type="text/javascript"></script>

<script id="bootstrapJs" type="text/javascript" src="${base}/plugins/zui/js/zui.js"></script>
</head>
<body>
	<div class="container">
		<% layout("/common/header.html"){} %>
		<div class="jumbotron">
			<div id="step2">
				<h4 class="text-center">
					请填入您的信息(带<span class="requied">*</span>为必填项)
				</h4>
				<form class="form-horizontal" role="form" action="" id="registerform">
					<div class="form-group has-feedback">
						<label for="ip-email" class="col-xs-3 col-sm-3 col-md-3 control-label">Email<span class="requied">*</span></label>
						<div class="col-xs-6 col-sm-6 col-md-6">
							<input type="email" name="user.email" class="form-control" value="${user.email}"  id="ip-email" placeholder="Email" >
						</div>
					</div>
					<div class="form-group has-feedback">
						<label for="ip-usernm" class="col-xs-3 col-sm-3 col-md-3 control-label">昵称<span class="requied">*</span></label>
						<div class="col-xs-6 col-sm-6 col-md-6">
							<input type="text" name="user.username" class="form-control" value="${user.username}" id="ip-usernm" placeholder="昵称" >
						</div>
					</div>
					<div class="form-group has-feedback">
						<label for="ip-usernm" class="col-xs-3 col-sm-3 col-md-3 control-label">登陆名<span class="requied">*</span></label>
						<div class="col-xs-6 col-sm-6 col-md-6">
							<input type="text" name="user.account" class="form-control" value="${user.account}" id="ip-account" placeholder="用户名" >
						</div>
					</div>
					<div class="form-group">
						<label for="ip-pwd" class="col-xs-3 col-sm-3 col-md-3 control-label">新密码<span class="requied">*</span></label>
						<div class="col-xs-6 col-sm-6 col-md-6">
							<input type="password" name="user.password"  class="form-control" value="${user.password}" id="ip-pwd" placeholder="密码">
						</div>
					</div>
					<div class="form-group has-feedback">
						<label for="ip-pwd2" class="col-xs-3 col-sm-3 col-md-3 control-label">再次输入密码<span class="requied">*</span></label>
						<div class="col-xs-6 col-sm-6 col-md-6">
							<input type="password" name="repassword"  class="form-control"  value="${user.password}" id="ip-pwd2" placeholder="再次输入密码">
						</div>
					</div>
					<div class="form-group has-feedback">
						<label class="col-xs-3 col-sm-3 col-md-3 control-label">地区<span class="requied">*</span></label>

						<div class="col-sm-2 col-xs-2 col-md-2 form-group">
							<div class="col-xs-8 col-sm-8 col-md-8">
								<select class="form-control" id="Select1" name="user.province" >
								</select>
							</div>
							<label for="ip-pwd" class="col-xs-1 col-sm-1 col-md-1 control-label">省<span class="requied"></span></label>
						</div>
						<div class="col-sm-2 col-xs-2 col-md-2">
							<div class="col-xs-8 col-sm-8 col-md-8">
								<select class="form-control" id="Select2" name="user.city">
								</select>
							</div>
							<label for="ip-pwd" class="col-xs-1 col-sm-1 col-md-1 control-label">市<span class="requied"></span></label>
						</div>
						<div class="col-sm-2 col-xs-2 col-md-2">
							<div class="col-xs-8 col-sm-8 col-md-8">
								<select class="form-control" id="Select3"  name="user.distinguish">
								</select>
							</div>
							<label for="ip-pwd" class="col-xs-1 col-sm-1 col-md-1 control-label">区<span class="requied"></span></label>
						</div>
					</div>

					<div class="form-group has-feedback">
						<label for="ip-pwd2" class="col-xs-3 col-sm-3 col-md-3 control-label">详细地址<span class="requied">*</span></label>
						<div class="col-xs-6 col-sm-6 col-md-6">
							<input type="text" class="form-control" id="address"  value="${user.detailaddress}" name="user.detailaddress" placeholder="输入详细地址"">
						</div>
					</div>

					<div class="form-group has-feedback">
						<label for="ip-phone" class="col-xs-3 col-sm-3 col-md-3 control-label">手机<span class="requied">*</span></label>
						<div class="col-xs-6 col-sm-6 col-md-6">
							<input type="tel" class="form-control" id="ip-phone" name="user.mobile"  value="${user.mobile}" placeholder="输入手机号以便为您提供更好的个性化服务">
							<span class="glyphicon glyphicon-ok form-control-feedback"></span> <span
								class="glyphicon glyphicon-warning-sign form-control-feedback"></span> <span class="help-block">请输入11位手机号</span>
						</div>
					</div>
					
					
					<div class="form-group">
						<label for="ip-pwd" class="col-xs-3 col-sm-3 col-md-3 control-label">确认密码<span class="requied">*</span></label>
						<div class="col-xs-6 col-sm-6 col-md-6">
							<input type="password" name="confirmpassword"  class="form-control" id="ip-confirmpwd" placeholder="密码">
						</div>
					</div>
					
					<div class="form-group">
						<div class="col-xs-offset-3 col-md-offset-3 col-xs-2">
							<a type="button" class="btn btn-primary" href="javascript:register();" style="width: 120px;">提交</a>
						</div>
						<div class="col-xs-offset-2 col-md-offset-2 col-xs-2">
							<a type="button" class="btn btn-default" href="${base}/" style="width: 120px;">返回登陆</a>
						</div>
					</div>
				</form>
			</div>
			<!-- /.modal -->
		</div>
	</div>
</body>
<!-- jQuery (necessary for Bootstrap's JavaScript plugins) -->
<script id="jquery" type="text/javascript" language="JavaScript" src="${base}/plugins/jquery.js"></script>
<!-- Include all compiled plugins (below), or include individual files as needed -->
<!-- 最新的 Bootstrap 核心 JavaScript 文件 -->
<script id="bootstrapJs" type="text/javascript" src="${base}/plugins/zui/js/zui.js"></script>
<script type="text/javascript" src="${base}/plugins/loadScripts.js"></script>
<script type="text/javascript" src="${base}/plugins/loadArea.js"></script>
<script type="text/javascript" src="${base}/plugins/nova.js"></script>
<script type="text/javascript" src="${base}/plugins/jsAddress.js"></script>

<script src="${base}/plugins/formValidator4.0.1/formValidator-4.0.1.js" type="text/javascript"></script>
<script src="${base}/plugins/formValidator4.0.1/formValidatorRegex.js" type="text/javascript"></script>
<script type="text/javascript">
	$(function(e) {
		addressInit('Select1', 'Select2', 'Select3',"${user.province}","${user.city}","${user.distinguish}");
		
		
		
		$.formValidator.initConfig({
			formID : "registerform",
			autoTip : true,
			tidyMode : true,
			onError : function(a, b, c) {
				var msg = new $.Messager(a, {
					type : 'warning',
					placement : 'bottom'
				});
				msg.show();
				$(b).focus();

				$("#configureformdiv").css('transform', 'rotate(5deg)');
				setTimeout(function() {
					$("#configureformdiv").css('transform', 'rotate(-5deg)')
				}, 250)
				setTimeout(function() {
					$("#configureformdiv").css('transform', 'rotate(0deg)')
				}, 500)

			}
		});

		$("#ip-email").formValidator({onShow : "请输入邮箱",onFocus : "邮箱6-100个字符,输入正确了才能离开焦点",onCorrect : "恭喜你,你输对了"}).regexValidator({regExp : "^([\\w-.]+)@(([[0-9]{1,3}.[0-9]{1,3}.[0-9]{1,3}.)|(([\\w-]+.)+))([a-zA-Z]{2,4}|[0-9]{1,3})(]?)$",onError : "你输入的邮箱格式不正确"});
		$("#ip-usernm").formValidator({onShow:"请输入昵称",onFocus:"昵称不能为空，长度必须大于4小于20",onCorrect:"输入正确"}).inputValidator({min:4,max:20,onError:"昵称不能为空，长度必须大于4小于20"});
		$("#ip-account").formValidator({onShow:"请输入用户名",onFocus:"用户名不能为空，长度必须大于4小于20",onCorrect:"输入正确"}).inputValidator({min:4,max:20,onError:"用户名不能为空，长度必须大于4小于20"});
		$("#ip-pwd").formValidator({onShow:"请输入密码",onFocus:"密码长度必须在6到50之间",onCorrect:"输入正确"}).inputValidator({min:6,max:50,onError:"密码长度必须在6到50之间"});
		$("#ip-pwd2").formValidator({onShow:"输再次输入密码",onFocus:"至少1个长度",onCorrect:"密码一致"}).inputValidator({min:1,empty:{leftEmpty:false,rightEmpty:false,emptyError:"重复密码两边不能有空符号"},onError:"重复密码不能为空,请确认"}).compareValidator({desID:"ip-pwd",operateor:"=",onError:"2次密码不一致,请确认"});
		$("#address").formValidator({onShow:"请输入详细地址",onFocus:"详细地址不能为空!",onCorrect:"输入正确"}).inputValidator({min:1,onError:"详细地址不能为空!"});
		$("#ip-phone").formValidator({onShow:"请输入你的手机号码，可以为空哦",onFocus:"你要是输入了，必须输入正确",onCorrect:"谢谢你的合作",onEmpty:"你真的不想留手机号码啊？"}).regexValidator({regExp:"mobile",dataType:"enum",onError:"你输入的手机号码格式不正确"});;
		$("#ip-confirmpwd").formValidator({onShow:"输再次输入密码",onFocus:"至少1个长度",onCorrect:"密码一致"}).inputValidator({min:1,empty:{leftEmpty:false,rightEmpty:false,emptyError:"重复密码两边不能有空符号"},onError:"重复密码不能为空,请确认"});
		
	});

	function register() {
		var flag = $.formValidator.pageIsValid();
		if(flag){
			$.ajax({
				url : "${base}/updateuserinfo",
				dataType : 'json',
				data : $("#registerform").serialize(),
				type : 'post',
				success : function(data) {
					if(data.flag){
						var msg = new $.Messager(data.msg,{type:'success',placement:'bottom'});
				       	msg.show();
					}else{
						var msg = new $.Messager(data.msg,{type:'warning',placement:'bottom'});
				       	msg.show();
					}
					//alert(data.msg);
				}
			});
		}
		
		
		
	}
</script>

</html>
